<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>分享有礼</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="__STATIC_URL__/static/mobile/css/cardshareali.css" />
    <script src="__STATIC_URL__/static/js/jquery-2.1.4.min.js"></script>

</head>
<style type="text/css">

    #shareCard .share-box {
        margin-top: 34px;
        width: 100%;
        height: 100%;
        margin: 0;

    }
    #shareCard .share-box > .share-content{
        border-bottom: none;
        height: 100%;
        position: initial;
        background: #fff;
        padding: 0 20px;
        margin-left: 5%;
        border-radius: 5px;
        width: 80%;
        left: 8%;
        top: 0;
    }
    .clear{ clear:both}
</style>
<body>
<div id="shareCard" style="width:100%;height:100%;">
    <div class="container" id="container">
        <div class="share-box" style="margin-top: 34px;margin-bottom: 50px;">

            <div class="share-content" style="border-bottom: none;margin: 0 auto;">
                <div class="store-box">

                    <img src="{$card['logo_url']}" alt=""class="store-logo">
                </div>

                <div class="store-info">
                    <p class="name">
                        <img src="__STATIC_URL__/static/mobile/images/VIP-green.png" alt=""class="icon-name icon">
                        <span class="name-text">{$card['title']}</span>
                    </p>
                    <p class="address">
                        <img src="__STATIC_URL__/static/mobile/images/huo.png" alt=""class="icon-address icon">
                        <span class="address-text">{$info.title}</span>
                    </p>
                </div>
                <img src="__STATIC_URL__/static/mobile/images/arrow-down.png" alt=""class="arrow-icon">
                <div class="code-box">
                    <img src="__STATIC_URL__/static/mobile/images/code-circle.png" alt=""class="code-circle"style="margin:0;">
                    {eq name="$card['activate']" value="1"}
                    <div id="qrcode"class="code-img" data-urloneshow="{:url('cardextend/getshareqrcode',array('id'=>$user['id']))}" data-urlone="/bizcard/{$user.id}.png">
                        <img class="code-pic" style="margin: -7px -3px;display:block" alt="" data-id="{$info.id}"data-card_id="{$info['card_id']}">
                    </div>
                    {else/}
                    <div class="code-img" >
                        <img class="code-pic" style="margin: -7px -3px;display:block" src="{$user.qrcode_url}" alt="">
                    </div>
                    {/eq}
                </div>
                <div class="code-text"style="color:#9e9e9e;border-bottom:1px dashed #eee;">说明</div>
                <p class="code-text"style="    margin-bottom: 20px;">{$info.content}</p>
                <div class="button-box" style="    margin-bottom: 20px;">
                    <button class="card-btn">邀请好友</button>
                </div>
                <div class="clear"></div>
            </div>

            <div class="clear"></div>
        </div>


    <input type="hidden" id="biz_url" value="{$user['url_mobile']}">
    <input type="hidden" id="fire_type" value="{$card['activate']}">
    </div>

    <div class="mask">
        <img src="__STATIC_URL__/static/mobile/images/share_card.png" alt=""class="share_img">
    </div>
</div>
</body>

<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script>
    $(function(){
        $(".card-btn").click(function(){
            $(".mask").css("display","block");
        });
        $(".mask").click(function(){
            $(".mask").css("display","none");
        })
    })
</script>
<script>
    $(function(){
        var id=$("#uid").val();

        var url1show = $("#qrcode").data("urloneshow");
        $(".code-pic").attr("src",url1show);
    })

</script>
<script type="text/javascript">

</script>
<script>
    wx.config({$share.wxjssdk});
    wx.ready(function () {
        // 1 判断当前版本是否支持指定 JS 接口，支持批量判断
        wx.checkJsApi({
            jsApiList: [
                'getNetworkType',
                'previewImage',
                'onMenuShareTimeline',
                'onMenuShareAppMessage',
                'onMenuShareQQ',
                'onMenuShareQZone'
            ],
        });
        var shareData = {$share.data};
        wx.onMenuShareAppMessage(shareData);
        wx.onMenuShareTimeline(shareData);
        wx.onMenuShareQQ(shareData);
        wx.onMenuShareWeibo(shareData);
    });

</script>
</html>